

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
    <title>Modal</title>
    <link rel="stylesheet" href="../assets/css/base_m.css">
    
 
    <style>
    .wrapper {
    max-width: 640px;
    margin: 0 auto;
    min-height: 100%;
    height: 100%;
}

.fade-enter-active,.fade-leave-active{-webkit-transition:opacity .15s,-webkit-transform .3s ease-out;transition:opacity .15s,-webkit-transform .3s ease-out;transition:transform .3s ease-out,opacity .15s;transition:transform .3s ease-out,opacity .15s,-webkit-transform .3s ease-out}
.fade-enter,.fade-leave-active{opacity:0!important}
.fade-enter.in .modal-dialog,.fade-leave-active.in .modal-dialog{-webkit-transform:translate(0,-25%);transform:translate(0,-25%)}
.slide-up-enter.in .modal-dialog,.slide-up-leave-active.in .modal-dialog{-webkit-transform:translateY(100%);transform:translateY(100%)}






    </style>
</head>
<body class="">
<div class="wrapper ">
    <h2>弹出框</h2>
    <div>
        <button class="btn btn-primary" data-toggle="modal" data-target="#dialog1">自定义内容</button>
        <button class="btn btn-primary" onclick="mAlert()">alert</button>
        <button class="btn btn-danger" onclick="mConfirm()">confirm</button>
        <button class="btn btn-athens" onclick="mConfirm2()">confirm2</button>
        <button class="btn btn-o" onclick="mNotice()">notice</button>
        <button class="btn btn-success" onclick="mLoading()">loading</button>
        <button class="btn btn-success" onclick="mLoading2()">loading hide</button>
    </div>
        
</div>

<div class="modal fade" tabindex="-1" role="dialog" id="dialog1">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Modal title</h4>
      </div>
      <div class="modal-body">
        <p>One fine body&hellip;</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary" data-dismiss="modal">Save changes</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

<script src="../vendor/jquery/jquery-2.1.4.min.js"></script>
<script src="../assets/js/dm.base.js"></script>
<script>
    var mAlert = function(){
        dm.alert('我是一本正经的')
    };
    var mConfirm = function(){
        dm.confirm('你决定要不要陪我',{},function(){
            alert('nice')
        },function(){
            alert('oh no')
        })
    };
    var mConfirm2 = function(){
        dm.confirm('你决定要不要陪我',{yes:'确定吗',no:'不确定吗'})
    };
    var mNotice = function(){
        dm.notice('你有一条未读消息',function(){

        });
    };
    var mLoading = function(){
        dm.loading('死命加载中');
    };
    var mLoading2 = function(){
        dm.loading('hide');
    };
</script>

</body>
</html>